<script lang="ts" setup>
import ProductBox from "../Common/ProductBox.vue";
import { ref } from "vue";

const value5 = ref<string>("Option1");
const value6 = ref<string>("");

const dataSource = [
  {
    key: "1",
    no: 2,
    header: 22,
    amount: "100",
    type: "100",
    prop: "100",
    status: ".....",
    applyTime: "2020-04-05",
    refundStatus: ".....",
  },
];

const columns = [
  {
    title: "编号",
    dataIndex: "no",
    key: "no",
  },
  {
    title: "抬头",
    dataIndex: "header",
    key: "header",
  },
  {
    title: "金额（元）",
    dataIndex: "amount",
    key: "amount",
  },
  {
    title: "类型",
    dataIndex: "type",
    key: "type",
  },
  {
    title: "性质",
    dataIndex: "prop",
    key: "prop",
  },
  {
    title: "申请时间",
    dataIndex: "applyTime",
    key: "applyTime",
  },
  {
    title: "状态",
    dataIndex: "status",
    key: "status",
  },
  {
    title: "退票状态",
    dataIndex: "refundStatus",
    key: "refundStatus",
  },
  {
    title: "操作",
    dataIndex: "operation",
    key: "operation",
  },
];

</script>
<template>
  <div class="pr-5 pl-5">
    <ProductBox title="发票申请列表">
      <template #default>
        <div class="flex justify-between flex-wrap">
          <router-link to="/finance/applyReceipt">
            <a-button type="primary" class="mb-5">申请开票</a-button>
          </router-link>
          <div class="flex w-100 mb-5">
            <a-input-group compact>
              <div class="flex whitespace-nowrap">
                <a-select v-model:value="value5">
                  <a-select-option value="Option1">发票编号</a-select-option>
                </a-select>
                <a-input v-model:value="value6" style="width: 70%" />
              </div>
            </a-input-group>
          </div>
          <a-button type="text">
            <img src="/console/downloadIcon.png" alt="" class="w-5 h-5" />
          </a-button>
        </div>

        <div class="mt-5"></div>
        <a-table :scroll="{ x: 1000, }" :dataSource="dataSource" :columns="columns" />
      </template>
    </ProductBox>
  </div>
</template>
<style lang="scss" scoped></style>
